Pull Request Description

Adds a floating animation example submission for Issue #515.

The animation creates a smooth vertical floating effect with dynamic shadow depth changes to improve the perception of elevation and motion. The demo also includes hover interaction and reduced-motion accessibility support.

Type of Change

• ✨ New animation / hover effect
• 🧩 New component
• 📝 Documentation improvement
• 🐛 Bug fix in an existing submission
• Other (describe below)

Submission Checklist

• All changes are inside submissions/examples/floating-animation-515/
• Includes demo.html — self-contained, opens in browser with no server
• Includes style.css — raw CSS for the proposed feature
• Includes README.md — what it does, how to use it, why it fits EaseMotion CSS
• No changes to core/
• No changes to components/
• One feature per PR (no bundled unrelated changes)

Feature Description

What does this add?

A reusable floating animation utility that smoothly moves elements up and down while dynamically adjusting shadow depth.

How does a developer use it?

<div class="floating-element">
    Floating Content
</div>

Why does it fit EaseMotion CSS?

The effect provides a lightweight, reusable micro-interaction that enhances visual engagement without requiring custom keyframes. It aligns with EaseMotion CSS's animation-first philosophy and is suitable for cards, hero sections, feature highlights, CTA elements, and decorative UI components.

Demo

• Demo added (demo.html works by opening directly in a browser)

Browser Testing

• Chrome
• Firefox
• Edge
• Safari (optional but appreciated)

Notes for Maintainer

• Includes prefers-reduced-motion support for accessibility.
• Hovering pauses the animation and highlights the element at its highest position.
• All files are contained within submissions/examples/floating-animation-515/ as required by the contribution guidelines.